<template>
  <SetItem title="弹窗唤醒键" toolText="设置方法：按住Control或alt或shift+任一按键组合">
    <template #pro>
      <el-input size="small" readonly v-model="hotKey" @keydown="keydown" @keyup="keyup" @focus="focus"></el-input>
    </template>
  </SetItem>
</template>

<script lang="ts">
import { defineComponent, ref } from "vue";
import { isElectron } from "@/utils";
import { setSystemMap } from "@/utils/api.ts";
import SetItem from "./setItem.vue";

export default defineComponent({
  name: "privacy",
  components: {
    SetItem,
  },
  setup() {
    if (!isElectron()) return
    const { ipcRenderer } = require("electron");
    const hotKey = ref(getOldKey());
    const isTop = ref(false);
    const openPersonal = ref(false);
    const hotKeyStack = new Set();
    const keyLimits = ['Control+w','Control+W','Control+f','Control+F','Control+c', 'Control+C', 'Control+v', 'Control+V', 'Control+x', 'Control+X']

    function getOldKey() {
      const infoMap = JSON.parse(localStorage.getItem("infoMap") || "null");
      let openKey = 'Ctrl+Q';
      infoMap.map((item: any) => {
        if (item.key === 'toggleKey') openKey = item.value
      })

      return openKey
    }

    function updateStoreKey(val: string) {
      const infoMap = JSON.parse(localStorage.getItem("infoMap") || "null");
      infoMap.map((item: any) => {
        if (item.key === 'toggleKey') item.value = val
      })
      localStorage.setItem("infoMap", JSON.stringify(infoMap) || '');
    }

    function keydown(e: KeyboardEvent) {
      switch (e.key) {
        case " ":
          hotKeyStack.add("Space");
          break;
        case "Backspace":
          hotKeyStack.clear();
          hotKey.value = "";
          break;
        default:
          hotKeyStack.add(e.key);
          break;
      }
      setHotKey();
    }

    function setHotKey() {
      // console.log(hotKeyStack)
      const firstElement = hotKeyStack.values().next().value;
      if (
        firstElement === "Control" ||
        firstElement === "Alt" ||
        firstElement === "Shift"
      ) {
        if (hotKeyStack.size > 1 && hotKeyStack.size < 4) {
          if (
            hotKeyStack.size === 2 &&
            hotKeyStack.has("Control") &&
            hotKeyStack.has("Alt")
          ) {
            return;
          }
          const kvalue = [...hotKeyStack].join("+");
          if (keyLimits.includes(kvalue)) {
            const { BrowserWindow } = require('@electron/remote')
            const { dialog } = require('@electron/remote')
            dialog.showMessageBox({
              type: "error",//图标类型
              title: "注意",//信息提示框标题
              message: "您无法设置该按键",//信息提示框内容
              buttons: ["确认"],//下方显示的按钮
              icon: 'none',//图标
              cancelId: 2//点击x号关闭返回值
            }, function (index: any) {

            })
            return
          } else {
            hotKey.value = kvalue
          }
          ipcRenderer.invoke("setOpenKey", { openKey: hotKey.value, oldKey: getOldKey() });
          setTimeout(() => {
            updateStoreKey(hotKey.value);
            setSystemMap([{ key: "toggleKey", value: hotKey.value }])
          }, 200)
        }
      } else {
        hotKeyStack.clear();
      }
    }
    function focus() {
      hotKeyStack.clear();
    }
    function keyup(e: KeyboardEvent) {
      console.log(e.key)
      hotKeyStack.delete(e.key);
    }

    return { isTop, openPersonal, hotKey, keydown, keyup, focus };
  },
});
</script>
<style scoped lang="scss">
.innerCon {
  padding: 20px;
  padding-top: 0;
}
</style>
